// import Modal from 'antd/lib/modal/Modal'
import {Modal} from 'antd';
import React, { Component } from 'react'
import './index.css'
import menuList from '../../config/menuConfig'
import { withRouter } from 'react-router-dom'

class Header extends Component {
    // 退出登录
    logout=()=>{
        Modal.confirm({
            title:'确认退出?',
            onOk:()=>{
                console.log('确认退出')
                console.log(111,this.props)
                this.props.history.replace('/login')
            },
            oncancel(){
                console.log('取消退出')
            }
        })
    }

    // 更新标题title
    getTitle=()=>{
        let title=''
        const path = this.props.location.pathname
        console.log(path)
        menuList.forEach(item=>{
            if(item.key == path){
                title=item.title
            }else if(item.children){
                const cItem =  item.children.find(cItem => path.indexOf(cItem.key)===0)
                if(cItem){
                    title = cItem.title
                }
            }
        })
        return title
    }

    render() {
        
        const title = this.getTitle()
        return (
            <div className='header'>
                <div className='header-top'>
                    欢迎 admin登录&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <a onClick={this.logout}>退出登录</a>
                </div>
                <div className='header-bottom'>
                    <div className='header-bottom-left'>{title}</div>
                    <div className='header-bottom-right'>
                        <span>monologue</span>
                    </div>
                </div>
            </div>
        )
    }
}

export default withRouter(Header)